<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt"%>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %>
<%  
response.setHeader("Access-Control-Allow-Origin", "*");  
%> 
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="referrer" content="no-referrer" />
    <title>微博·数据工厂</title>
	<link href="${pageContext.request.contextPath }/img/webLogoIcon.png" rel="shortcut icon">
    <link href="${pageContext.request.contextPath }/css/bootstrap.min.css" rel="stylesheet">
    <link href="${pageContext.request.contextPath }/css/font-awesome.css" rel="stylesheet">
    <link href="${pageContext.request.contextPath }/css/animate.css" rel="stylesheet">
    <link href="${pageContext.request.contextPath }/css/style.css" rel="stylesheet">
    <!-- FooTable -->
    <link href="${pageContext.request.contextPath }/css/footable.core.css" rel="stylesheet">
    <link href="${pageContext.request.contextPath}/css/mypage.css" rel="stylesheet">
</head>
<body>
    <div id="wrapper">
        <nav class="navbar-default navbar-static-side" role="navigation">
            <%request.setAttribute("LEFT", "weibo");%>
            <%@include file="../components/left.jsp"%>
        </nav>
        <div id="page-wrapper" class="gray-bg">
        <div class="row border-bottom" style="margin-bottom: 20px;">
		<jsp:include page="../components/head.jsp" flush="true" />
        </div>
        <div class="row wrapper border-bottom white-bg page-heading">
            <div class="col-lg-9">
                <h2>微博</h2>
                <ol class="breadcrumb">
                	<li class="nav-main1">
                		<a href="${pageContext.request.contextPath}/admin/tosystem_overview">主页</a>
                	</li>
                	<li class="nav-main2" >
                		<a id="navigation1" href="#" >社交媒体</a>
                	</li>
                	<li class="active">
                		<a>微博</a>
                	</li>
               	</ol>
            </div>
        </div>
        <div class="wrapper wrapper-content animated fadeInRight">
            <div class="row">
                <div class="col-lg-12">
                <div class="ibox float-e-margins" id="dataInfoLine"></div>
                    <div class="ibox float-e-margins">
                        <div class="ibox-content">
                            <div class="row m-t-sm">
                                <div class="col-lg-12">
                                <div class="panel blank-panel">
                               <div class="panel-heading" style="display: none">
                                    <div class="panel-options">
                                        <ul class="nav nav-tabs">
                    						<li class="active" style="margin-left: 78%;">
                                            	<div class="select">
                                       				<select class="form-control" id="time" onchange="timeseek(this)">
                                         				<option value="all">全部</option>
								                    	<option value="24h">24小时</option>
								                    	<option value="7d">7天</option>
								                    	<option value="15d">15天</option>
							                    	</select>
										       </div>
						                    </li>
                    						<li><input type="text" class="form-control" id="searchkeyword" placeholder="搜索关键词"></li>
		                                    <li>
		                                        <button tabindex="-1" class="btn btn-white" type="button" onclick="article(1)">Go!</button>
		                                        
		                                     </li>
                                        </ul>
                                    </div>
                                </div>
                                <div class="panel-body">
                                <div class="tab-content">
                                
                                 <div class="input-select" style="margin-bottom: 20px">
	                               		<div class="input-selectbox">
                                            <button data-toggle="dropdown" class="btn btn-primary dropdown-toggle" type="button"  aria-expanded="false">
                                            <i class="fa fa-bars"></i>
                                            <span id="inputSelected">全部</span></button>
                                            <ul class="dropdown-menu" id="selectlist">
                                            	<li><a onclick="setselect(this)">全部</a></li>
                                                <li><a onclick="setselect(this)">正文</a></li>
                                                <li><a onclick="setselect(this)">标题</a></li>
                                            </ul>
	                                        <input type="text" class="form-control" style="width:440px;padding-right: 42px;">
	                                        <i id="gosearch" class="fa fa-search cursearch" onclick="search()"></i>
	                                    </div>
	                                </div>
                                
                                
                                <div class="tab-pane active" id="tab-1">
                                
                                  			 
                                  			 
                                    <div class="feed-activity-list" id="list">
                                    	<!-- <div class="heKmna">
                                    		<div class="block-top">
                                    			<a target="_blank" href="https://m.weibo.cn/u/1647850037"><img src="https://wx4.sinaimg.cn/large/62383235gy1gc3x4gcd2hj20ru0fo40x.jpg"></a>
                                    			<div class="block-info">
                                    			<p>2月1日，春秋航空执飞东京羽田-武汉特殊包机航班，运送111名滞留在日本的湖北，特别是武汉籍中国公民返乡。机组在执行完航班后，进行了14天的隔离健康观察，《看春秋》 摄制组以视频日记的形式，记录下了机组成员在健康观察期内的生活点滴。 #看春秋#特别篇·逆飞机组的“隔离日记”，为每一位抗击疫情的人鼓掌！ #共同战疫，春秋人在行动# #抗击新型肺炎民航在行动# #春运路上随手拍# http://t.cn/A6hQqsMn</p>
                                    			</div>
                                    		</div>
                                    		<div class="block-bottom">
                                    			<div>
													<a target="_blank" href="https://m.weibo.cn/u/1647850037"><span class="ant-avatar ant-avatar-circle ant-avatar-image"><img src="https://tvax2.sinaimg.cn/crop.25.31.251.251.180/62383235ly8gar6rzm1xyj208c08cjtw.jpg"></span></a>
													<a href="https://m.weibo.cn/u/1647850037">春秋航空</a>
												</div>
												<div>
						                   				<span class="styled__StyledSpan-sc-145erc9-26 gzDWDn"><font style="vertical-align: inherit;">点赞:1</font></span>
						                   				<span class="styled__StyledSpan-sc-145erc9-26 gzDWDn"><font style="vertical-align: inherit;">评论:72</font></span>
						                   				<span class="styled__StyledSpan-sc-145erc9-26 gzDWDn"><font style="vertical-align: inherit;">收藏:3</font></span>
												</div>
                                    		</div>
                                    	</div> -->
                                    </div>
                                    <div class="feed-activity-list" id="logs">
                                    	<div class="box" id="box" style="float: right;"></div>
                                    </div>
                                </div>
                                </div>
                                </div>
                                </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
        </div>
        </div>
		<jsp:include page="../components/footer.jsp" flush="true" />
        </div>
        </div>
        <div style="width:100vh;height:100vh;position:fixed;background:#ccc;"></div>
    <!-- Mainly scripts -->
    <script src="${pageContext.request.contextPath }/js/jquery-2.1.1.js"></script>
    <script src="${pageContext.request.contextPath }/js/bootstrap.min.js"></script>
    <script src="${pageContext.request.contextPath }/js/jquery.metisMenu.js"></script>
    <script src="${pageContext.request.contextPath }/js/jquery.slimscroll.min.js"></script>
    <!-- Custom and plugin javascript -->
    <script src="${pageContext.request.contextPath }/js/inspinia.js"></script>
    <script src="${pageContext.request.contextPath }/js/pace.min.js"></script>
    <!-- FooTable -->
    <script src="${pageContext.request.contextPath }/js/footable.all.min.js"></script>
	<script src="${pageContext.request.contextPath}/js/mypage.js"></script>
		<script src="${pageContext.request.contextPath}/js/anychart-base.min.js"></script>
	<script src="${pageContext.request.contextPath}/js/userCustom.js"></script>
    <!-- Page-Level Scripts -->
    <script>
    
//     查看图片大图
		function zoom(that){
			var url =$(that).attr("data-url")
			console.log(url)
			var zoomhtml = 
				'<div class="zoombox">'+
				'	<div class="zoomimgbox">'+
				'		<div class="zoomimg">'+
				'			<img width="200px" src="'+url+'">'+	
				'		</div>'+
				'	</div>'+
				'</div>'
			$('body').append(zoomhtml)	
			$(".zoombox").on("click",function(){
				$(".zoombox").remove()
			})
			var onwheel = function(e){
			　　　console.log(e);
			};

			document.addEventListener("wheel", onwheel, false);
		}    
    
    
    	var sourceName = '%E5%BE%AE%E5%8D%9A'
    	var seedId = '3566'
    
       $(document).ready(function() {
    	   var data=${nowArray};
           createLine("微博",1,data);
            $('.footable').footable();
        });
        
        $(function(){
        	article(1)
		});
        
        var time = ''
        
        function timeseek(obj) {
        	time = $(obj).val()
        	article(1)
		}
        
		function article(pageNum){
			var searchkeyword = $('#searchkeyword').val()
        	$.ajax({
        		url : "${pageContext.request.contextPath}/socialMedia/article",
        		type : "post",
        		data:{
        			pageNum: pageNum,
        			sourceName: sourceName,
        			seedId: seedId,
        			time: time,
        			searchkeyword: searchkeyword
        		},
        		success : function(res1) {
        			$('#list').html('')
        			let res = JSON.parse(res1);
        			if (res.totalPage > 500) {
        				res.totalPage = 500;
					}
        			paging(res.totalData, res.totalPage, pageNum)
        			var list = res.list
        			for (var i = 0; i < list.length; i++) {
        				var content = list[i].content
        				if (content.length - 300 > 0) {
        					content = content.substring(0, 300) + '......'
						}
        				var imgbox = '';
        				var videobox = '';
        				var imghtml="";
        				var endstring=JSON.parse(list[i].extend_string_one);
        				var video="";
        				
        				var videolist=endstring.videoorientationurl;
        				if(videolist !=""){
        						video=video+
							    '    <div class="video-group">'+
							    '        <div class="video-box">'+
							    '        <video height="200px" poster="" controls="controls" src="'+videolist+'"></video>'+
							    '        </div>'+
							    '    </div>'
        				}
        				
        				var imglist=endstring.imglist;
        				console.log(imglist)
        				if(imglist.length !=0){
	        				for (var k = 0; k < imglist.length; k++) {
	        					imghtml=imghtml+
	        					'        <div class="img-inline" data-url="'+imglist[k].imgurl+'" onclick="zoom(this)">'+
							    '            <div style="background:url('+imglist[k].imgurl+')"></div>'+
							    '        </div>'
							}
	        				imgbox=
							    '    <div class="img-group mb-10">'+
							    		imghtml+
							    '    </div>'
	        				
        				}else {
        					imgbox='';
    					}
        				
//         				if(zhuanfa){
//         					var zhuanfa = 
//         						 '    <!-- 转发  start-->'+
//   							    '    <div class="transpond-line">'+
//   							    '        <div class="transpond">'+
//   							    '        @财经网 
//   							    '        【#钟南山称疫情发生在武汉不等于源头在武汉#】#钟南山回应新冠肺炎源头#：钟南山介绍，
//   							    '        新冠肺炎疫情发生在武汉，不等于源头在武汉，没有证据，这是科学问题，没有搞清楚就下结论是
//   							    '        不负责任的。L人民日报的微博视频 ​
//   							    '        </div>'+
//   							    '    </div>'+
//   							    '    <!-- 转发  end-->'+
//         				}
        				
        				let publish_time = list[i].publish_time;
                        publish_time = publish_time.substring(0,16);
						var html = 
							 '<div class="weibo-info b-b">'+
							    '    <div class="first-line">'+
							    '        <a target="_blank" href="'+list[i].author_url+'"><div class="head-img"><div style="background: url('+list[i].websitelogo+');"></div></div></a>'+
							    '        <div class="nick-name">'+list[i].title+'</div>'+
							    '        <div class="tips-box">'+
							    '            <span>转发：'+list[i].forwardingvolume+'</span>'+
							    '            <span>评论：'+list[i].commentsvolume+'</span>'+
							    '            <span>点赞：'+list[i].praisevolume+'</span>'+
							    '        </div>'+
							    '		 <div style="position: absolute;right: 0;">'+publish_time+'</div>'+
							    '    </div>'+
							    '    <div class="second-line">'+
							    '        <div class="weibo-content mb-10">'+
							    content+
							    '        </div>'+
							    '    </div>'+imgbox+video+'</div>';
							
					     $('#list').append(html)
					}
        			if (list.length == 0) {
        				nodata("#list")
//         				$('#list').html('<div class="feed-element">暂无数据！</div>')
					}
        		},
        		error: function(res) {
        			nodata("#list")
//         			$('#list').html('<div class="feed-element">暂无数据！</div>')
        		}
        	});
        }
		
        function paging(totalData,totalPage, pagenum) {
			$('#box').paging({
				initPageNo : pagenum, // 初始页码
				totalPages : totalPage, //总页数
				totalCount : '合计' + totalData + '条数据', // 条目总数
				slideSpeed : 600, // 缓动速度 单位毫秒
				jump : true, //是否支持跳转
				callback : function(page) { // 回调函数 
					}
			});
		}
        
		function JumpToPage(pageNum) {
			article(pageNum)
		}

		//跑马灯方法 
// 		 function init(){
// 			    //获取标题
// 			    var title=document.title;
// 			    //分割字符串--->字符数组
// 			    var arr=title.split("");
// 			    //删除第一个元素并返回该元素
// 			    var e=arr.shift();
// 			    //把一个对象添加到数组末尾
// 			    arr.push(e);
// 			    //把数组转换成字符串
// 			    var marquee=arr.join("");
// 			    //返回给浏览器
// 			    document.title=marquee;
// 			    //定时一直执行
// 			    window.setTimeout("init()",1000);
// 			}
// 			window.onload=init;
    </script>
</body>
</html>
